import { ref, customRef } from "vue"

export default function (initValue: string, delay: number) {
  // 自定义ref
  let timer: number
  // track:跟踪,trigger:触发
  let msg = customRef((track, trigger) => {
    return {
      // msg被读取时调用
      get() {
        console.log("msg被读取了")
        track() //跟踪initValue值的变化
        return initValue
      },
      // msg被修改时调用
      set(newValue) {
        // 实现一个默认ref无法实现的功能,即延迟响应
        clearTimeout(timer)
        timer = setTimeout(() => {
          console.log("msg被修改了", newValue)
          initValue = newValue
          trigger() // 通知vue,initValue值变化了
        }, delay)
      },
    }
  })

  return { msg }
}
